<template>
  <div class="newProject">
    <div style="width: 95%;height: 838px; margin: auto;margin-top: 20px;">
      <div>
        <el-form>
          <el-row type="flex" justify="space-between"
            style="border: 1px solid #DCDFE6;height: 56px;background-color: #F5F7FA;">
            <el-col :span="5" class="colLeft">
              <span class="required">项目编号：</span>
            </el-col>
            <el-col :span="6" class="colRight">
              <el-form-item label="" prop="name">
                <span class="text">{{ projectInfo.no }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="5" class="colLeft">
              <span>技术合同登记号：</span>
            </el-col>
            <el-col :span="6" class="colRight">
              <el-form-item label="">
                <span class="text">{{ projectInfo.contractNo }}</span> </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex" justify="space-between"
            style="border: 1px solid #DCDFE6;height: 56px;background-color: #F5F7FA;">
            <el-col :span="5" class="colLeft">
              <span class="required">项目名称：</span>
            </el-col>
            <el-col :span="18" class="colRight">
              <el-form-item label="">
                <span class="text">{{ projectInfo.name }}</span> </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex" justify="space-between"
            style="border: 1px solid #DCDFE6;height: 56px;background-color: #F5F7FA;">
            <el-col :span="5" class="colLeft">
              <span class="required">甲方单位：</span>
            </el-col>
            <el-col :span="6" class="colRight">
              <el-form-item label="">
                <span class="text">{{ projectInfo.establishUnit }}</span> </el-form-item>
            </el-col>
            <el-col :span="5" class="colLeft">
              <span class="required">项目类型：</span>
            </el-col>
            <el-col :span="6" class="colRight">
              <el-form-item label="">
                <span class="text">{{ projectInfo.type }}</span> </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex" justify="space-between"
            style="border: 1px solid #DCDFE6;height: 56px;background-color: #F5F7FA;">
            <el-col :span="5" class="colLeft">
              <span class="required">项目开始时间：</span>
            </el-col>
            <el-col :span="6" class="colRight">
              <el-form-item label="">
                <span class="text">{{ projectInfo.establishTime }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="5" class="colLeft">
              <span class="required">项目完成时间：</span>
            </el-col>
            <el-col :span="6" class="colRight">
              <el-form-item label="">
                <span class="text">{{ projectInfo.endTime }}</span>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex" justify="space-between"
            style="border: 1px solid #DCDFE6;height: 56px;background-color: #F5F7FA;">
            <el-col :span="5" class="colLeft">
              <span class="required">项目总经费(万元)：</span>
            </el-col>
            <el-col :span="6" class="colRight">
              <el-form-item label="">
                <span class="text">{{ projectInfo.totalFee }}</span> </el-form-item>
            </el-col>
            <el-col :span="5" class="colLeft">
              <span>项目到款额(万元)：</span>
            </el-col>
            <el-col :span="6" class="colRight">
              <el-form-item label="">
                <span class="text">{{ projectInfo.receivedMoney }}</span> </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex" justify="space-between"
            style="border: 1px solid #DCDFE6;height: 56px;background-color: #F5F7FA;">
            <el-col :span="5" class="colLeft">
              <span class="required">牵头部门：</span>
            </el-col>
            <el-col :span="6" class="colRight">
              <el-form-item label="">
                <span class="text">{{ projectInfo.leadDeptName }}</span> </el-form-item>
            </el-col>
            <el-col :span="5" class="colLeft">
              <span class="required">项目下达性质：</span>
            </el-col>
            <el-col :span="6" class="colRight">
              <el-form-item label="">
                <span class="text">{{ projectInfo.nature }}</span> </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex" justify="space-between"
            style="border: 1px solid #DCDFE6;height: 140px;background-color: #F5F7FA;">
            <el-col :span="5" class="colLeft">
              <span>项目描述：</span>
            </el-col>
            <el-col :span="18" class="colRight">
              <span class="text">{{ projectInfo.description }}</span>
            </el-col>
          </el-row>
          <el-row type="flex" justify="space-between"
            style="border: 1px solid #DCDFE6;height: 140px;background-color: #F5F7FA;">
            <el-col :span="5" class="colLeft">
              <span>备注：</span>
            </el-col>
            <el-col :span="18" class="colRight">
              <span class="text">{{ projectInfo.remark }}</span>
              <!-- <el-input :disabled="true" type="textarea" :rows="5" placeholder="" v-model="textarea"> -->
              <!-- </el-input> -->
            </el-col>
          </el-row>
        </el-form>
      </div>

    </div>
  </div>
</template>

<script>
export default {
  components: {
  },
  props: {
    projectInfo: {
      type: Object,
      required: false,
    }
  },
  data() {
    return {
      form: {},
    }
  },
  mounted() {
  },
  methods: {
    onSubmit() {
      console.log('submit!');
    }
  }
}
</script>

<style scoped>
.newProject {
  width: 95%;
  height: 100%;
  background-color: #FFFFFF;
  margin-top: 20px;

  .colRight {

    padding: 10px;
    background-color: #FFFFFF;

    .text {
      font-family: PingFangSC-Regular;
      font-weight: 400;
      font-size: 14px;
      color: #606266;
      line-height: 22px;
    }
  }

  .colLeft {
    /* border: 1px solid #DCDFE6; */
    background-color: #F5F7FA;
    text-align: center;
    margin: auto;
  }
}

/* span.required::after {
  content: "*";
  color: #f56c6c;
  margin-right: 4px;
} */
</style>
<style>
.el-form-item__error {
  z-index: 999 !important;
}
</style>
